<template>
  <div>
    <van-nav-bar fixed :title="type==0?'我的推荐人':'我的上级'" left-arrow @click-left="$utils.back($route.path)" />
    <div class="has-top">
      <div class="pos-r">
        <div class="flex-d-c flex-center pos-a z-out photomain">
          <!-- <img src="@/assets/images/avar.png" class=" imgbr is-130 br-full" alt="" /> -->
          <headPortrait-box class="img-box pos-r imgbr br-full is-130" :headPortraitUrl="data.Images"></headPortrait-box>
          <p class="fs-36 color-white pt-20 fw-b" v-show="data.UserRole==0">{{data.NickName}}</p>
        </div>
        <img v-if="type == 0" src="@/assets/images/referrer_bg1.jpg" alt="" />
        <img v-if="type == 1" src="@/assets/images/referrer_bg2.jpg" alt="" />
      </div>
      <div class="contain pos-a bg-white full-width pt-40 plr-32">
        <div v-show="data.UserRole==0">
          <div class="flex-v-c"><img src="@/assets/images/referrer_icon1.png" class="" alt="" />会员号</div>
          <p>{{data.CardNumber}}</p>
        </div>
        <div v-show="data.UserRole==0">
          <div class="flex-v-c"><img src="@/assets/images/referrer_icon2.png" class="" alt="" />姓　名</div>
          <p>{{data.UserName}}</p>
        </div>
        <div v-show="data.UserRole==0">
          <div class="flex-v-c"><img src="@/assets/images/referrer_icon3.png" class="" alt="" />等　级</div>
          <p>{{data.GradeName}}</p>
        </div>
        <div>
          <div class="flex-v-c"><img src="@/assets/images/referrer_icon4.png" class="" alt="" />电　话</div>
          <a :href="'tel:'+data.Tel" style="color:#6192CE">{{data.Tel}}</a>
        </div>
        <div>
          <div class="flex-v-c"><img src="@/assets/images/referrer_icon5.png" class="" alt="" />微信二维码</div>
          <SvgIcon v-if="data.ServiceWX" icon-class="cashCode" class="fs-52" @goPage="look" />
          <div v-else>未设置</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import SvgIcon from 'components/SvgIcon'
import { GetMyInviteUserInfo } from 'api/member'
import { ImagePreview } from 'vant';
import headPortraitBox from 'components/headPortraitBox'
export default {
  components: {
    SvgIcon,
    headPortraitBox
  },
  data() {
    return {
      type:null,
      data: {
      }
    }
  },
  computed: {
    // 计算属性的 getter
  },
  created() {
    let type = this.$route.path;
    console.log(this.$route.path)
    if(type=='/referrer'){
      type = 0
    }else{
      type = 1
    }
    this.type = type;
    this.GetMyInviteUserInfo(type)
  },
  methods: {
    look() {
      ImagePreview({
        images: [this.$webInfo.ImgDomain+this.data.ServiceWX],
        showIndex:false,
      })
    },
    GetMyInviteUserInfo(type) {
      GetMyInviteUserInfo({type:type}).then(res => {
        if (res) {
          this.data = res.Data;
        }
      })
    }
  },
  mounted() {}
}
</script>
<style lang="scss" scoped>
.imgbr {
  border: 4px solid #fffddc;
}
.photomain {
  width: 100%;
  top: 123px;
}
.contain {
  top: 455px;
  min-height: calc(100% - 455px);
  border-radius: 0.4rem 0.4rem 0 0;
  font-size: 32px;
  & > div {
    height: 112px;
    border-radius: 12px;
    background: #f8f8f8;
    padding: 0 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    div > img {
      width: 36px;
      margin-right: 24px;
    }
  }
}
</style>
